<template>
  <div>
    <headers :form-data="params" :name-list="nameList" />
    <el-card>
      <tableData
        :table-name="tableList"
        :arr="arr"
        :table-obj="tableObj"
        :form="params"
        @delFn="delFn"
        @stopBtn="stopBtn"
        @publicFn="publicFn"
      />
      <Page
        :params="params"
        :total="total"
        @updataTable="getAreaList"
      />
    </el-card>
  </div>
</template>

<script>
import headers from '@/components/Public/header.vue'
import Page from '@/components/Public/page.vue'
import tableData from '@/components/Public/tableDate.vue'
import { getAreaApis, delAreaApi } from '@/api'
export default {
  components: { headers, Page, tableData },
  data() {
    return {
      params: {
        warehouseName: '',
        id: '',
        name: '',
        size: 10,
        current: 1
      },
      nameList: ['仓库名称', '库区名称', '仓库状态'],
      arr: ['所属仓库', '库区编号', '库区名称', '温度类型', '承重类型', '用途属性', '库区状态', '负责人', '联系电话', '库位数量', '更新时间'],
      tableObj: {
        '所属仓库': 'warehouseName',
        '库区编号': 'code',
        '库区名称': 'name',
        '温度类型': 'temperatureType',
        '承重类型': 'bearingType',
        '用途属性': 'useType',
        '库区状态': 'status',
        '负责人': 'personName',
        '联系电话': 'phone',
        '库位数量': 'includedNum',
        '更新时间': 'updateTime'
      },
      tableList: [],
      total: 0,
      statusObj: {}
    }
  },
  created() {
    this.getAreaList()
  },
  methods: {
    publicFn(val) {
      this.params = {
        code: val.code, // 仓库编号
        name: val.name, // 仓库名称
        current: val.current, // 页
        size: val.size, // 数量
        status: val.status// 状态
      }
      this.getAreaList(this.params)
    },
    // 点击打开启用禁用
    stopBtn(val) {
      this.statusObj.status = val.status
      this.statusObj.id = val.id
      this.isShow = true
    },
    // 删除
    delFn(val) {
      delAreaApi(val.id)
      this.getAreaList(this.params)
      this.$message.success('删除成功')
    },
    // 获取库区列表
    async getAreaList() {
      const { data } = await getAreaApis(this.params)
      this.tableList = data.data.records
      this.total = Number(data.data.total)
    }
  }
}
</script>

<style lang="scss" scope>
  .el-card{
    margin-bottom: 30px;
  }
  .el-button {
    margin-bottom: 20px;
  }
</style>
